<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:ui="http://java.sun.com/jsf/facelets">
<h:head>
</h:head>

<h:body>
	<ui:composition template="/WEB-INF/templates/registrationFormTemplate.xhtml">

		<ui:define name="content">
			
			<div style="width: 100%; height: 300px; border: 1px solid grey;">
				<h:form >
					
					<h:panelGrid columns="3" border="0" width="700" style="margin-left:auto;margin-right:auto;"
					title="Registration Form" frame="above" columnClasses="lableCol,componentCol,validationMsgCol">
						<h:outputLabel value="Email Id"/>
						
						<h:inputText  id="emailId" value="#{reg.profile.emailId}"
							style="width:150px;" size="150" requiredMessage="#{msg.emailIdValidation}">
							<f:validateRequired for="emailId" />
							<f:validateLength minimum="8" maximum="150" />
						</h:inputText>
						
						<h:message for="emailId" />
						
						<h:outputLabel value="Password"/>
						<h:inputSecret id="password" value="#{reg.profile.password}" 
							style="width:150px;" size="20"
							requiredMessage="#{passwordRequired}">
							<f:validateRequired for="password"/>
							<f:validateLength minimum="8" maximum="20"/>
						</h:inputSecret>
						<h:message for="password"/>
						
						<h:outputLabel value="Profile For"/>
						<h:selectOneListbox  id="profileFor">
							<f:attribute name="a" value="a"> </f:attribute>
						</h:selectOneListbox>
						
						<h:message for="profileFor" />
						
						
						<h:outputLabel value="Name"/>
						<h:panelGroup>						
							<h:inputText id="firstName" value="#{reg.profile.firstName}" requiredMessage="First Name is required">
								<f:validateRequired for="firstName" />
							</h:inputText>
							<h:inputText id="lastName" value="#{reg.profile.lastName}"/>
						</h:panelGroup>
						<h:message for="firstName" />
						
						<h:outputLabel value="Gender"/>
						<h:selectOneRadio id="gender" value="#{reg.profile.gender}" requiredMessage="#{msg.genderRequired}">
							<f:selectItem itemLabel="Male" itemValue="m" />
							<f:selectItem itemLabel="Female" itemValue="f"/>
							<f:validateRequired for="gender"/>
						</h:selectOneRadio>
						
						<h:message for="gender" />
						
						<h:outputLabel value=" "/>
						<h:commandButton value="Create Profile" action="#{reg.saveProfile()}"/>
					</h:panelGrid>
					
				</h:form>			
			</div>
			
		</ui:define>

		<ui:define name="footer">
		
			Welcome to our marriage portal
		</ui:define>

	</ui:composition>
</h:body>

</html>